html
  margin: 0px
  padding: 0px

body
  width: 100%
  min-width: 1000px
  margin: 0px
  padding: 0px
  background: url('../img/fbkg.png') #161616
  font: normal 14px Arial, "Helvetica Neue", "Lucida Grande", Verdana

a
  color: white
  font-weight: bold
  text-decoration: none
  
  img
    border: none
  
a:hover
  text-decoration: underline
  
h1
  margin: 0px
  font-size: 100px
  line-height: 75px
  color: #1e1e1e
  letter-spacing: -5px

h2
  margin: 0px
  font-size: 20px
  line-height: 30px
  color: #1e1e1e
  letter-spacing: -1px
  
h3
  margin: 0px
  line-height: 0px
  font-size: 25px
  line-height: 30px
  color: #808080
  text-shadow: 0px 1px 0px black
  
  &#accesos
    color: white

h4
  margin: 0px
  padding-top: 50px
  line-height: 0px
  font-size: 25px
  line-height: 30px
  color: white
  text-shadow: 0px 1px 0px black
  
p
  text-align: justify
  font-weigth: normal
  font-size: 14px
  line-height: 20px
  color: #bcbcbc
  
em
  font-family: "Courier New", Courier
  background-color: #4f4f4f
  padding: 2px 4px
  -webkit-border-radius: 5px
  -moz-border-radius: 5px
  
.clear
  clear: both

  
#container
  margin: 0 auto

#header
  background: url('../img/wsp.jpg') no-repeat center #0b7a9b
  min-height: 580px
  
#promo_spash
  margin: 0 auto
  width: 1000px
  min-height: 557px
  position: relative
  z-index: 1
  top: 150px
  
  #iphone
    width: 320px
    height: 557px
    background: url('../img/iphone.png') no-repeat
    float: left
    
    #screen
      height: 330px
      width: 220px
      background-color: white
      position: relative
      top: 84px
      left: 52px
      overflow: hidden
      
      #video
        height: 330px
        width: 220px
      
  #promo_text
    text-align: right
    float: left
    width: 680px
    
    img
      position: relative
      top: -70px
      z-index: 1
  
#navi
  border-top: 2px solid #919191
  border-bottom: 2px solid #191919
  min-height: 400px
  background: url('../img/navicolor.jpg') no-repeat center 0 #1f1f1f
  
  #navi_content
    margin: 0 auto
    width: 1000px
    
    #menu
      margin-top: 90px
      width: 420px
      float: left
      position: relative
      z-index: 1
      
      ul
        margin: 0px
        padding: 0px
        list-style: none
        
        li
          margin: 0px
          padding: 0px
      
        li .option
          display: block
          cursor: pointer
          height: 40px
          width: 372px
          background: url('../img/menusel.png') no-repeat
        
        #incidencia
          background-position: 0px 0px
        
        #incidencia.selected
          background-position: -372px 0px
          
        #geo
          background-position: 0px -40px

        #geo.selected
          background-position: -372px -40px
            
        #puertos
          background-position: 0px -80px

        #puertos.selected
          background-position: -372px -80px
        
        #accesos
          background-position: 0px -120px

        #accesos.selected
          background-position: -372px -120px

        #camaras
          background-position: 0px -160px

        #camaras.selected
          background-position: -372px -160px

        #informado
          background-position: 0px -200px

        #informado.selected
          background-position: -372px -200px
            
        #api
          background-position: 0px -240px

        #api.selected
          background-position: -372px -240px
    
      .content_selected_left
        padding: 10px 20px 10px 0px
      
        ul
          margin: 0px
          padding-left: 20px
          color: #b1b1b1
          list-style-type: square
      
          li
            color: #d0d0d0
            font-size: 16px
            
            a
              text-decoration: none
              color: white
            
            a:hover
              color: #919191
      
    #menu_content
      background: url('../img/sep.jpg') repeat-y
      width: 580px
      min-height: 340px
      float: left
      margin: 30px 0px
      
      .content_selected
        text-align: justify
        line-height: 20px
        padding: 10px 10px 10px 30px
        color: #bcbcbc
        
        h3
          text-align: left
        
#shadow
  height: 33px
  background: url('../img/sdw.png')
  
#footer
  margin: 0 auto
  width: 1000px
  min-height: 75px
  text-align: right
  
  .button
    color: white
    font-size: 18px
    background-color: black
    padding: 5px 8px
    -webkit-border-radius: 5px
    -moz-border-radius: 5px
    border-bottom: 1px solid #3b3b3b
    float: right
    margin: 0px 4px
    
    a
      font-weight: normal
      color: white
      text-decoration: none
    
    a:hover
      color: #919191
    
    span
      padding-left: 4px
      position: relative
      top: 3px
    
    .b_img
      width: 32px
      height: 26px
      background: url('../img/icnb.png') no-repeat
      float: left
      
    .facebook
      background-position: 0px -26px
    
    .twitter
      background-position: 0px -52px
    
    .gbot
      background-position: 0px -78px
    
    .last
      background-position: 0px -104px
      
    .faq
      background-position: 0px -130px
  
